// pages/video/video.js
import request from '../../utils/request'

Page({

  /**
   * 页面的初始数据
   */
  data: {
    videoGroupList:[],   //导航数据
    videoId:'',    //导航item的id
    videoIdPage:[], //对应导航栏下的页数
    videoContentItem:[],   //视频数据
    imageId:'',    //图片对应的videoId
    videoUpdateTime:[],    //保存每个video播放时长
    isTriggered: false  //标识下拉刷新是否被触发
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    this.videoContentList()
  },
  //请求导航数据
  async videoContentList(){
    let videoListData = await request('/video/group/list')
    this.setData({
      videoGroupList: videoListData.data.slice(0,14),
      videoId: videoListData.data[0].id
    })

    this.getVideoList(this.data.videoId)
  },
  //请求对应导航下的视频数据
  async getVideoList(videoId){
    let masList = await request('/video/group',{id: videoId});
     //关闭加载提示框
    wx.hideLoading()

    let index =0;
    let videoContentItem = masList.datas.map(item =>{
      item.id = index++
      return item
    })
    this.setData({
      videoContentItem,
      isTriggered: false    //关闭下拉刷新
    })
  },
  // 点击切换导航
  videoHit(event){
    let videoId= event.currentTarget.dataset.id;
    this.setData({
      videoId,
      videoContentItem:[]
    })
    //显示加载提示框
    wx.showLoading({
      title: '加载中',
    })
    //动态获取当前导航的视频列表数据
    this.getVideoList(this.data.videoId);
  },
  //点击播放/继续播放的回调
  videoPlay(event){
    /**
     * 需求：
     *  1.点击播放的事件中找到上一个播放的视频
     *  2.在播放新的视频关闭上一个正在播放的视频
     * 单例模式：
     *  1.在需要创建多个对象的时候，通过一个变量接收，这样始终保留一个对象；
     *  2.好处：节省内存空间
     */
    let vid = event.currentTarget.id;
    //停止上一个视频的播放
    this.vid !== vid && this.videoContext && this.videoContext.stop();
    //创建video的实例
    this.videoContext = wx.createVideoContext(vid);
    let {videoUpdateTime} =this.data;
    let vidoBeforeTime = videoUpdateTime.find(item => item.vid === vid);
    if (vidoBeforeTime) {
      this.videoContext.seek(vidoBeforeTime.currentTime)
    }
    this.vid = vid;
    this.setData({
      imageId: vid
    })
  },
  // 监听视频播放进度回调
  bindTimeUpdate(event){
    let videoTimeObject = {vid: event.currentTarget.id, currentTime: event.detail.currentTime};
    let {videoUpdateTime} =this.data;
    /**
     * 思路：
     *  判断记录播放时长的videoUpdateTime数组中是否有当前播放的视频
     *  1.如果有，在原来的播放记录中修改播放时间为当前时间
     *  2.如果没有，需要在数组中添加当前视频的播放对象
     */
    let videoTime =videoUpdateTime.find(item => item.vid === videoTimeObject.vid)
    if (videoTime) {
      videoTime.currentTime = videoTimeObject.currentTime;
    }else{
      videoUpdateTime.push(videoTimeObject);
    }
    this.setData({
      videoUpdateTime
    }) 
  },
  //监听视频播放结束删除对应数据回调
  bindEnded(event){
    let {videoUpdateTime} =this.data;
    videoUpdateTime.splice(videoUpdateTime.findIndex(item => item.vid === event.currentTarget.id),1);
    this.setData({
      videoUpdateTime
    })
  },
  //监听下拉刷新回调
  handleRefresh(){
    console.log('下拉刷新');
    this.getVideoList(this.data.videoId);
  },
  //监听上拉加载新的数据
  async bandleTolower(){
    let newPage ={vid: this.data.videoId, page: 1}
    let {videoIdPage} =this.data;
    let currentVidoPage = videoIdPage.find(item => item.vid === this.data.videoId);
    if (currentVidoPage) {
      currentVidoPage.page++
    }else{
      videoIdPage.push(newPage);
    }
    this.setData({
      videoIdPage
    })
    let newpage = this.data.videoIdPage.findIndex(item => item.vid === this.data.videoId);
    let newVideoData =await request('/video/group',{id: this.data.videoId,offset: this.data.videoIdPage[newpage].page})
    let newVideoContentItem=this.data.videoContentItem.concat(newVideoData.datas); 
    this.setData({
      videoContentItem: newVideoContentItem
    })
  },

  //跳转到搜索页面
  toSearch(){
    wx.navigateTo({
      url: '/pages/search/search',
    })
  },
  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {
      console.log('页面下拉刷新');
  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function (event) {
    if (event.from === 'button') {
      return{
        title:'button转发的内容',
        path:'/pages/video/video',
        imageUrl:'/static/images/nvsheng.jpg'
      }
    }else{
      return{
        title:'menu转发的内容',
        path:'/pages/video/video',
        imageUrl:'/static/images/nvsheng.jpg'
      }
    }
    
  }
})